<template>
	<view class="content">
		<view class="">
			<image :src="IP+imageArr[0]" mode=""></image>
			<text class="footer iconfont icon-xiangyou1" @click="edittouxiang"></text>
		</view>
		<!-- <view class="">
			<text>昵称</text>
			<text class="footer iconfont icon-xiangyou1" @click="tiao('../edit_message/edit_message')"></text>
		</view> -->
		<view class="">
			<text>修改密码</text>
			<text class="footer iconfont icon-xiangyou1" @click="tiao('../edit_message/edit_message')"></text>
		</view>
		<view class="">
			<text>{{email}}</text>
			<text class="footer iconfont icon-xiangyou1" @click="inputDialogToggle(1)"></text>
		</view>
		<view class="">
			<text>{{telNum}}</text>
			<text class="/footer iconfont icon-xiangyou1" @click="inputDialogToggle(2)"></text>
		</view>
	</view>
	<view class="">
		<uni-popup ref="inputDialog" type="dialog">
						<uni-popup-dialog ref="inputClose"  mode="input" :title="val==1?'修改邮箱':'修改电话号码'" :value="val==1?email:telNum"
						 @confirm="dialogInputConfirm"></uni-popup-dialog>
		</uni-popup>
	</view>
	<!-- <camera class="camera" v-show="false"></camera> -->
</template>

<script>
	import {ref,computed,reactive,toRefs} from 'vue';
	import {useStore} from 'vuex'
	import store from '../../store/index.js';
	import http from '../../utils/http.js'
	export default {
		setup(){
			const {state,commit,dispatch,getters} = useStore();
			let data=reactive({
				src:'',
				src2:'',
				val:'',
				work_id:'200002',
				IP:computed(()=>state.IP),
				imageArr:[],
				email:'12345678@qq.com',
				telNum:'1111111',
				edittouxiang(){
					uni.showActionSheet({
						itemList: ['拍照', '从相册选择'],
						success: function (res) {
							// console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
							if(res.tapIndex==0){
								console.log('用户选择了拍照')
								uni.navigateTo({
									url: '../camera/camera'
								});
							}
							else if(res.tapIndex==1){
								console.log('用户选择了系统相册')
								uni.chooseImage({
									count: 1, //默认9
									sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
									sourceType: ['album'], //从相册选择
									success: function (res) {
										// console.log(JSON.stringify(res.tempFilePaths));
									uni.uploadFile({
												url:data.IP+'/home/upload_touxiang', 
												filePath: res.tempFilePaths[0],
												name:'file',
												success: function(res1) { ///返回！！！！！！
													data.imageArr=[]
													data.imageArr.push('/images/'+res1.data)
													// if(data.imageArr.length>2){
													// 	data.imageArr.splice(0,1)
													// }
													// console.log(res1.data);
													// console.log(data.imageArr);
													data.src2=data.IP+data.imageArr[0];
													console.log(store.state.liujinchang)
													store.commit('liujinchang/editImage',res1.data)
													console.log(data.src2)
															http({
																			url:'/home/gettouxiang',
																			method:'post',
																			data:{
																				imgName:res1.data,
																				work_id:'200002'
																			}
																		}).then((res3)=>{
																			// data.IP=store.state.IP
																			console.log(res3)
																			
																		})
																		
																	},
																	fail: function(e) {
																		console.log(e)
																	}												
																})
									}
								});
							}
						},
						fail: function (res) {
							console.log(res.errMsg);
						}
					});
				},
				// editEmail(){
						
				// }
			})
			
			return {...toRefs(data)}
		},
		methods: {
			inputDialogToggle(e) {
							this.$refs.inputDialog.open()
							// console.log(e,this.$refs.inputDialog.open())
							this.val=e
						},
			dialogClose() {
					console.log('点击关闭')
			},
			dialogInputConfirm(val) {
				console.log(val)
				// console.log(this.val)
				let type=''
				if(this.val==1){
					type='email'
				}else{
					type='phone'
				}
				http({
								url:'/home/edit_Msg',
								method:'post',
								data:{
									sql:`UPDATE admin SET `+type+`=`+`'`+val+`'`+` WHERE work_id=`+`'`+this.work_id+`'`
								}
							}).then((res)=>{
								// data.IP=store.state.IP
								console.log(res)
								if(res.data.code==200){
									this.val==1?this.email = val:this.telNum=val
									if(this.val==1){
										store.commit('liujinchang/editEmail',val)
									}else{
										store.commit('liujinchang/edittel',val)
									}
									uni.showModal({
										content: res.data.msg,
																showCancel: false,
																confirmText:"确定",
																success: function (res) {
																	if (res.confirm) {
																		console.log('用户点击确定');
																	} else if (res.cancel) {
																		console.log('用户点击取消');
																	}
																}
									});
								}else{
									uni.showModal({
										content: '修改失败',
																showCancel: false,
																confirmText:"确定",
																success: function (res) {
																	if (res.confirm) {
																		console.log('用户点击确定');
																	} else if (res.cancel) {
																		console.log('用户点击取消');
																	}
																}
									});
								}
							})
				}
		},
		onShow() {
			console.log(store.state.liujinchang.user.figure)
			let src='/images/'+store.state.liujinchang.user.figure
			this.imageArr.push(src)
			console.log(this.IP+this.imageArr[0])
			this.telNum=store.state.liujinchang.user.phone
			this.email=store.state.liujinchang.user.email
		}
	}
</script>

<style lang="less">
@import url("~@/static/font/iconfont.css");
page{
	background-color: rgb(242,242,242);
	padding: 20rpx;
	box-sizing: border-box;
}
image{
	width: 150rpx;
	height: 150rpx;
	margin-right: 30rpx;
	border-radius: 75rpx;
}
.content{
	background: #FFFFFF;
	padding: 20rpx;
	border-radius: 10rpx;
}
.content>view{
	display: flex;
	align-items: center;
	padding: 20rpx;
	text{
		color: #999;
	}
	text:last-child{
		position: absolute;
		right: 40rpx;
	}
}
// .camera{
// 	display: none;
// }
</style>
